<template>
  <van-row class="page-apply-list">
    <van-nav-bar
      left-text="返回"
      :right-text="operateType === $vo.OperateType.APPLY ? '新建' : ''"
      title="加分申请列表"
      @click-left="$router.back(-1)"
      @click-right="startCreateApply"/>
    <panel-raise-filter :assessType="assessType" @onQuery="doQuery"/>
    <van-empty v-if="showEmpty" description="无加分申请信息" />
    <card-raise-apply
      v-for="(apply, index) in applyList"
      :key="apply.id"
      :index="index"
      :apply ="apply"
      v-on:onClick="showApplyDetail"/>
    <van-loading v-if="listLoad" class="query-load" type="spinner" >努力加载中...</van-loading>
    <van-row v-if="!listFinished && applyList.length >= condition.pageSize" @click="doGetApplyList" class="query-load">
      {{listError ? '载入失败，重新加载...' : '加载更多...'}}
    </van-row>
    <van-popup
      v-model="showPageRaiseDetail"
      position="right"
      get-container="body"
      style="width: 100%; height: 100%; background-color: #F9F9F9">
      <page-raise-detail v-if="showPageRaiseDetail" :apply="selectApply" :assessType="assessType" :operateType="operateType" v-on:onCancel="showPageRaiseDetail = false" @onConfirm="doConfirm"/>
    </van-popup>
  </van-row>
</template>

<script>
import CardRaiseApply from '@/views/common/card/CardRaiseApply'
import PageRaiseDetail from '@/views/raise/PageRaiseDetail'
import PanelRaiseFilter from '@/views/common/panel/PanelRaiseFilter'
import { getAddApplyList } from '@/api/assess'
export default {
  name: 'PageRaiseList',
  components: { CardRaiseApply, PageRaiseDetail, PanelRaiseFilter },
  props: ['assessType', 'operateType'],
  data () {
    return {
      showEmpty: false,
      listError: false,
      listLoad: false,
      listFinished: false,
      showPageRaiseDetail: false,
      condition: this.$vo.createCondition(),
      applyList: [],
      selectApply: null
    }
  },
  mounted () {
    this.condition.user_id = this.$store.state.authInfo.user.userid
    this.condition.op = this.operateType
    this.condition.apply_type = this.assessType

    this.doGetApplyList()
  },
  methods: {
    startCreateApply () {
      this.selectApply = null
      this.showPageRaiseDetail = true
    },
    doConfirm () {
      this.applyList = []
      this.doGetApplyList()
      this.showPageRaiseDetail = false
    },
    showApplyDetail (apply) {
      this.selectApply = apply
      // this.selectApply.applyType = this.applyType
      this.showPageRaiseDetail = true
    },
    doQuery (condition) {
      this.condition = condition
      this.condition.user_id = this.$store.state.authInfo.user.userid
      this.condition.op = this.operateType
      this.condition.apply_type = this.assessType
      this.applyList = []
      this.doGetApplyList()
    },
    doGetApplyList () {
      this.listLoad = true
      this.listError = false
      getAddApplyList(this.condition).then(res => {
        this.listLoad = false
        let { data } = res
        if (data[this.$response.CODE] === this.$response.SUCCESS) {
          let listData = data[this.$response.DATA].list
          if (listData.length > 0) {
            // 下次查询页增加1
            this.condition.pageNum = this.condition.pageNum + 1
            this.listFinished = listData.length < this.condition.pageSize
            // 将返回数据追加到展示列表中
            this.applyList = this.applyList.concat(listData)
          }
          this.showEmpty = this.applyList.length === 0
        } else {
          this.listError = true
          this.$toast.fail('获取数据失败：' + data[this.$response.MESSAGE])
        }
      }, errFunc => {
        this.listLoad = false
        this.$notify('服务调用失败：' + errFunc.toString())
        console.log(errFunc.toString())
      })
    }
  }
}
</script>

<style scoped lang="less">
  .page-apply-list{
    /deep/ .card-raise-apply{
      margin-top: 3px;
    }
    .query-load{
      padding: 10px 0px;
      text-align: center;
    }
  }
</style>
